<template>
	<div class="top">
		<div class="body">
			<el-form label-width="100px" :data="from" style="margin-top: 100px;" class="form">
				<el-form-item label="姓名" prop="shoujianren">
					<el-input v-model="from.shoujianren"  type="text"></el-input>
				</el-form-item>
				<el-form-item label="手机号" prop="shouhuoshoujihao">
					<el-input v-model="from.shouhuoshoujihao"  type="text"></el-input>
				</el-form-item>
				<el-form-item label="地址" prop="shouhuodizhi">
					<el-input v-model="from.shouhuodizhi" type="text"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button @click="onSubmit()">提交</el-button>

				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
import httpApi from "@/myaxios/index"
export default {
	data() {
		return {
			from: []
		}
	},
	methods: {
		shouHuo() {
			let id = this.$route.params.id
			httpApi.GerenZhongxin.shouHuo({ id }).then(res => {
				console.log('加载', res.data[0])
				//渲染option列表
				this.from = res.data[0]
				console.log(this.from)
			})
		},

		onSubmit(){

			this.$confirm('此操作将修改个人信息, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {

	httpApi.GerenZhongxin.xiuGaishouHuo(this.from).then(res=>{
				console.log(res.data)
			})


			this.$router.push(`/home/gerenzhongxin/${localStorage.getItem("userId")}/dizi/xinzhedizhi`)

          this.$message({
            type: 'success',
            message: '修改成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消修改'
          });          
        });






		
		}
	},

	mounted() {
		this.shouHuo()
	}



}
</script>

<style lang="scss" scoped>
.nav-bar {
	width: 100%;
	height: 30px;
	background-color: #D3D3D3;
	display: flex;

}

.top {
	position: relative;

	.body {
		position: absolute;
		left: 130px;
		top: 40px;
		width: 500px;
		height: 300px;
	}
}
</style>
